<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="../../lib/layui/css/layui.css">
    <link rel="stylesheet" href="../../css/oksub.css">
    <link rel="stylesheet" href="../../myicon/iconfont.css" type="text/css">
    <meta charset="UTF-8"/>
    <title>诊断申请列表</title>
</head>
<style>
    .list-con {
        padding: 0 10px 15px 10px;
        margin-bottom: 20px;
    }

    .list-con .layui-table td,
    .layui-table-view,
    .layui-table[lay-skin=line],
    .layui-table[lay-skin=row] {
        border: none;
    }

    .list-con .layui-table tbody {
        color: #777777;
    }

    .list-con .layui-table tbody tr:hover,
    .layui-table[lay-even] tr:nth-child(even) {
        background-color: rgb(226, 226, 226);
        color: black;
        font-weight: bold;
    }

    .layui-table tr {
        border-bottom: 1px #e2e2e2 solid;
    }


    .typeButton {
        height: 27px;
        vertical-align: middle;
        font-size: 13px;
        text-align: center;
        line-height: 27px;
    }

    .layui-btn-primary-inside {
        background-color: #1E9FFF;
        border: none;
        color: #FFF;
    }

    .layui-btn-normal-inside {
        background-color: #FFF;
        color: #1E9FFF;
        border: 1px solid #1E9FFF;
    }
</style>

<body>
<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>诊断申请</legend>
</fieldset>
<div class="layui-row">
    <form class="layui-form ok-form">
        <div class="layui-form-item" style="margin-left: 30px">
            <div id="changeType">
                <button type="button" class="typeButton layui-btn layui-btn-normal-inside layui-btn-radius"
                        selectType="0" value="-1">
                    <i class="iconfont icon-quanbu" style="font-size: 19px;padding-right:5px;"></i>
                    全部
                </button>
                <button type="button"
                        class="typeButton layui-btn layui-btn-primary layui-btn-primary-inside layui-btn-radius"
                        selectType="1" value="0">
                    <i class="iconfont icon-huaban181" style="font-size: 18px;padding-right:5px;"></i>
                    未分配
                </button>
                <button type="button"
                        class="typeButton layui-btn layui-btn-primary layui-btn-primary-inside layui-btn-radius"
                        selectType="1" value="1">
                    <i class="iconfont icon-huaban181" style="font-size: 18px;padding-right:5px;"></i>
                    已分配
                </button>
                <button type="button"
                        class="typeButton layui-btn layui-btn-primary layui-btn-primary-inside layui-btn-radius"
                        selectType="1" value="1">
                    <i class="iconfont icon-huaban181" style="font-size: 18px;padding-right:5px;"></i>
                    已处理
                </button>
                <div id="selectForm" style="float: right; margin-right:50px;"
                     class="layui-btn layui-btn-normal layui-btn-radius">
                    <i class="layui-icon layui-icon-search"></i>
                </div>
                <div id="selectEmpty" style="float: right; margin-right:10px;"
                     class="layui-btn layui-btn-normal layui-btn-radius">
                    刷新
                </div>
            </div>
        </div>
    </form>
</div>
<!--数据表格-->
<div class="list-con">
    <table class="layui-hide" id="tableId" lay-filter="tableId"></table>
</div>
</body>



<script src="../../lib/layui/layui.js"></script>
<script src="../../js/jquery.min.js"></script>
<script src="../../js/application.js"></script>
<script src="../../js/model.js"></script>
<script>
    var selectType = "0"; //按钮状态
    layui.use(["table", 'form', 'okLayer', 'layer'], function () {
        let $ = layui.jquery;
        let table = layui.table;
        let form = layui.form;
        let okLayer = layui.okLayer;
        let layer = layui.layer;

        var thisValue = -1;//查询类别
        //分派信息绑定
        let articleTable = table.render({
            elem: "#tableId",
            url: "../../data/diagnosis.json",
            where: {
                // 'procTatus': thisValue//当前的状态
            },
            parseData: function (res) { //res 即为原始返回的数据
                var datas = res.data;

                return {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.count, //解析数据长度
                    "data": res.data //解析数据列表
                };
            },
            cols: [[
                {field: 'id', title: '角色ID', width: 150, fixed: 'left', unresize: true, sort: true, hide:true}
                , {field: 'username', title: '姓名', width: 150}
                , {field: 'location', title: '所在地区', width: 250}
                , {field: 'department', title: '所属医院', width: 250}
                , {field: 'description', title: '描述'}
                ,{
                    field: "status", title: "状态", width: 100, templet: function (d) {
                        if (d.status == "未分配") {
                            return "<div style='color:#d92d29;font-weight: bold;font-size:15px'>" + d.status + "</div>"
                        }else if (d.status == "已分配") {
                            return "<div style='color:#fae600;font-weight: bold;font-size:15px'>" + d.status + "</div>"
                        } else{
                            return "<div style='color:#478f43;font-weight: bold;font-size:15px'>" + d.status + "</div>"
                        }
                    }
                }
            ]],
            page: {
                layout: ['prev', 'page', 'next', 'skip', 'count'],
                groups: 3,
                limit: 15,
                theme: '#1E9FFF',
            },
        });
        //根据所选择的状态按钮，跳转案件状态详细页面
        table.on('row(tableId)', function (obj) {
            var data = obj.data;
            var state = data.procTatus;

            var url = "./waitingForDistribution.html"
            show(url);
            obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
        });
        //跳转详细页面设置
        function show(url) {
            window.open(url, 'newwindow', 'width=' + (window.screen.availWidth - 10) + ',height=' + (window.screen.availHeight - 30) + ', top=0, left=0, toolbar=no, menubar=no, scrollbars=yes, resizable=yes,location=no, status=no')
        }
        //回到全部页面
        $("#changeType button").on('click', function () {
            $("#changeType button").removeClass("layui-btn-normal-inside");
            $(this).addClass("layui-btn-normal-inside")
            selectType = $(this).attr("selectType");
            thisValue = $(this).val();
            articleTable.reload({
                where: {
                    'procTatus': thisValue
                },
                page: {
                    curr: 1
                }
            })
        })



        //搜索
        $("#selectForm").on('click', selectForm);
        function selectForm() {
            okLayer.open("查询条件", "selectForm.html", "35%", "60%", function (layero) {
                let iframeWin = window[layero.find("iframe")[0]["name"]];
            }, function () {
                //获取搜索页面传过来的搜索条件
                var caseId = window.document.caseId;
                var procLevel = window.document.procLevel;
                var caseDescription = window.document.caseDescription;
                var startTime = window.document.startTime;
                var endTime = window.document.endTime;
                var newStartDate = startTime.replace(/-/g, "/");//时间格式转换
                var newEndDate = endTime.replace(/-/g, "/");
                //置空搜索框
                window.document.caseId="";
                window.document.procLevel="";
                window.document.caseDescription="";
                window.document.startTime="";
                window.document.endTime="";
                var isChange=window.document.isChange;
                window.document.isChange=0
                if(isChange!=1){
                    return
                }
                //重载页面
                articleTable.reload({
                    where: {
                        'procTatus': thisValue,
                        'caseId':caseId,
                        'procLevel':procLevel,
                        'caseDescription':caseDescription,
                        'startTime':newStartDate,
                        'endTime':newEndDate
                    },
                    page: {
                        curr: 1
                    }
                })
                return false;
            })
        }

        //刷新页面
        $("#selectEmpty").on('click', backAll);
        function backAll() {
            articleTable.reload({
                where: {
                    //传到服务器数据
                    'procTatus': thisValue,
                    'caseId':'',
                    'procLevel':'',
                    'caseDescription':'',
                    'startTime':'',
                    'endTime':''
                },
                page: {
                    curr: 1//回到第一页
                }
            })
            return false;
        }
    })
</script>
</html>